<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <script type='text/javascript' src='js/jquery-2.2.3.min.js'></script>
    <meta name="Author" content="npc-guangming">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>个人中心</title>
    <style type="text/css">
        .header1 {
            position: relative;
            width: 100%;
            height: 150px;
            margin: 10px 0 10px 0;
            top: -56px;
        }

        div.header_img {

            display: block;
            width: 120px;
            margin: 0 auto;
        }

        .banner {
            position: relative;
            width: 100%;
        }

        .banner img {
            width: 100%;
            height: 200px;
            background-size: contain;
        }

        .p_cy {
            text-align: center;
            margin: 15px 0 10px 0;
            font-size: 25px;
        }

        .div_age {
            display: block;
            width: 100%;
            margin: 0 auto;
            text-align: center;
            margin: 5px;
            color: #e47198;
        }

        .div_age i {
            display: inline-block;
            position: relative;
            top: 2px;
            width: 16px;
            height: 16px;
            background: url(images/man.png) no-repeat center;
        }

        .div_address {
            display: block;
            width: 100%;
            margin: 0 auto;
            text-align: center;
            margin: 5px;
        }

        .div_address i {
            display: inline-block;
            position: relative;
            top: 2px;
            width: 16px;
            height: 16px;
            background: url(images/address.png) no-repeat center;
        }

        .button_look {
            position: absolute;
            bottom: -18%;
            display: block;
            width: 129px;
            left: 50%;
            margin-left: -69px;
            z-index: 99;
            background: #e47198;
            color: #fff;
        }

        .pep_edit {
            position: relative;
            top: -187px;
            left: 67%;
            width: 97px;
            height: 16px;
            font-size: 16px;
            padding: 5px;
            line-height: 16px;
            background: #fff;
            border-radius: 5px;
        }

        .pep_edit a {
            color: #000;
            font-family: Microsoft yahei;
            font-size: 1em;
            text-decoration: none;
        }

        .header_nav {
            position: fixed;
            width: 100%;
            height: 50px;
            font-size: 18px;
            text-align: center;
            line-height: 50px;
            background: #675e5e;
            z-index: 999;
        }

        .header_nav i {
            display: inline-block;
            position: relative;
            left: -45%;
            top: 2px;
            width: 16px;
            height: 16px;
            background: url("../images/a2.jpg") no-repeat center;
        }

        .span_back {
            float: left;
            margin-left: 35px;
            color: #fff;
        }

        .span_center {
            display: inline-block;
            position: relative;
            left: -33px;
            color: #fff;
        }

        * {
            margin: 0px;
            padding: 0px;
        }

        html {
            width: 100%;
            height: 100%;
        }

        body {
            width: 100%;
            height: 100%;
            background: #f2f2f2;
        }

        #header {
            width: 100%;
            position: relative;
            background: white;
            top: 0px;
            z-index: 10;
        }

        #header ul {
            width: 100%;
            background: white;
        }

        #header ul li {
            width: 25%;
            float: left;
            list-style: none;
            background: white;
            line-height: 40px;
            font-size: 16px;
            color: #808080;
            border-bottom: 1px solid white;
        }

        #header ul li:nth-of-type(1) {
            color: #acd000;
            border-bottom: 1px solid #09c5da;
        }

        #header ul li div {
            margin-left: 5%;
            width: 90%;
            line-height: 40px;
            text-align: center;
            background: white;
            color: #3e3e3e;
        }

        #wrapper {
            width: 96%;
            margin-left: 2%;
            background: white;
            position: relative;
            margin-top: 50px;
            left: 0px;
            z-index: 9;
            height: 100%;
        }

        #wrapper ul {
            width: 98%;
        }

        #wrapper ul li {
            width: 100%;
            list-style: none;
            /* border: 1px solid #dddddd;*/
            border-radius: 4px;
            border-bottom: 6px solid #f2f2f2;
            background: white;
        }

        .orderNum {
            color: #808080;
            font-size: 16px;
            line-height: 40px;
            border: 1px solid #f2f2f2;
        }

        .orderNum span {
            float: right;
            color: red;
        }

        .imglist {
            border: 1px solid #f2f2f2;
        }

        .imglist img {
            width: 20%;
            margin: 5px;
            border: 1px solid #f2f2f2;
        }

        .orderMsg {
            color: #808080;
            font-size: 16px;
            line-height: 60px;
            border: 1px solid #f2f2f2;
        }

        .orderMsg span {
            display: inline-block;
            float: right;
            margin-right: 5px;
            color: gray;
            line-height: 30px;
            margin-top: 15px;
            border: 1px solid #f2f2f2;
        }

        #float_view {
            position: fixed;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 100%;
        }

        p {
            text-align: center;
        }

        /*软文样式*/
        ul {
            margin-top: 10px;
        }

        li a{
            list-style: none;
            color: #00c4da;
            line-height: 26px;
            text-decoration: underline;
            font-size: 15px;
        }

        li a:active:focus:visited {
            color: red;
        }
    </style>
</head>

<body style="width: 100%;overflow: hidden;">
<!-- Modal -->
<div id="logo_view"></div>
<div id="float_view">
    <div id="msg"></div>
</div>
<!-- <img style="position: absolute;width: 25%;top: 10px;left: 10px;z-index: 999;"  src="./images/logo.png"> -->
<div class="banner" style="height: 300px;background-color: #0ac5da;position: relative;margin-bottom: 10px;">
    <!--  <img src="images/Group.png"> -->
    <div style="padding-top: 50px;color: #fff;line-height: 30px;">
        <img id="mem_img" style="height: 100px;width: 100px;border-radius: 50px;display: block;margin: 0 auto;"
             src="./images/profile-image-men.jpg">
        <p id="name"></p>
        <p id="work"></p>
        <div id="mine_change" style="color: red;font-size: 12px;text-align: center;display: block;width: 100%;">
            
        </div>
        <div id="cname" style=" text-align: center;"></div>
    </div>
    <!--   <div class="div_age">
         <i></i>&nbsp<span class="span_age">?岁&nbsp</span><span class="span_job">公务员&nbsp</span><span class="span_cons">狮子座</span>
     </div>
     <div class="div_address"><i></i>&nbsp<span class="span_address">河北省&nbsp邯郸市&nbsp</span><span class="span_race">汉族</span></div> -->
    <div class="pep_edit" style="position: absolute;top:20px;" id="editor">完善个人信息</div>
</div>
<div id="header">
    <ul>
    </ul>
</div>

<div id="page" style="background-color: #fff;padding: 5px 10px;margin-top: 50px;position: relative;top: 10px;">
    <ul id="show_view">
    <!--     <li><a href="#">婚恋心理：剩女必学5个脱单攻略</a></li>
        <li><a href="#">恋爱技巧之如何处理恋爱中遇到的问题</a></li> -->
    </ul>
</div>


<script type="text/javascript">
    if (localStorage.getItem('number')) {
        $.ajax({
            url: "/member/getMemberinfoByNum?number=" + localStorage.getItem('number'),
            type: "get",
            dataType: "json",
            success: succesFunc,
            error: errorFunc
        });

        function succesFunc(res) {
            if (res.code == 200) {
                if(res.data[0].yn){
                 $("#mine_change").text('普通会员');  
                  getMyActivity() 
                 //getActivity();
                }else{
                       $("#page").css("padding",'0');
                 $("#show_view").empty();
                    $("#mine_change").text('您还未通过实名认证');   
                }
                $("#cname").text(res.data[0].nickname)
                $("#mem_img").attr("src",res.data[0].mem_img);
            }
        }

        function errorFunc(res) {

        }

    } else {
        document.getElementById('mine_change').innerHTML = '注册/登陆';
           $("#page").css("padding",'0');
                 $("#show_view").empty();
        $("#editor").hide();
    }
    $("#mine_change").click(function(){
      if ($(this).text()=="注册/登陆") {
        
        console.log(123)
        window.location.href="./index.html"
      }

    })
   

    var nomal_color = "#e47198";
    var shit_color = "#09c5da";
    var list = new Array("我的活动", "我的关注", "我的点赞");
    addHeader(list);

    function addHeader(list) {
        var headerHtml = "";
        for (var i = 0; i < list.length; i++) {
            headerHtml += "<li value=" + i + "><div>" + list[i] + "</div></li>"
        }
        $("#header ul").empty().append(headerHtml);
        $("#header ul li").css("width", 100 / list.length + "%");
        $("#header ul li").click(function () {
            $(this).css("color", shit_color);
            $(this).css("border-color", shit_color);
            $(this).siblings().css("color", nomal_color);
            $(this).siblings().css("border-color", "white");
            console.log($(this).val());
            if (localStorage.getItem('number')) {
                 if ($(this).val()=='0') {
               getActivity()
            }else if($(this).val()=='1'){
            getFocus();

            }else{
             getLike();
 
            }
            }
           
            
        })
    }

    function order() {
        this.picture = "/img/1.png";
        this.price = "6.6";
        this.count = "1";
        this.orderNum = "0021000827095"
    }

    var order1 = new order();
    var orderArr = new Array(order1, order1);
    var orderHtml = ""
    $("#editor").click(function (event) {
        window.location.href = "./message.html";
    });
   

    function getMyActivity() {

        $.ajax({
            url: "/member/getMyActivity?number=" + localStorage.getItem('number'),
            type: "get",
            dataType: "json",
            success: succesFunc,
            error: errorFunc
        });

        function succesFunc(res) {
            var arr=new Array();
            if (res.code == 200) {
                for (var i = 0; i < res.data.length; i++) {
                   if (res.data[i].title) {
                    arr.push(res.data[i])
                   }
                }
            showList(arr,'0');
                
            }
        }

        function errorFunc(res) {

        }
    }
    
    function getActivity(){
      $.ajax({
            url: "/mine/getActivity?num=" + localStorage.getItem('number'),
            type: "get",
            dataType: "json",
            success: succesFunc,
            error: errorFunc
        });

        function succesFunc(res) {
            var arr=new Array();
            if (res.code == 200) {
                for (var i = 0; i < res.data.length; i++) {
                   if (res.data[i].title) {
                    arr.push(res.data[i])
                   }
                }
            showList(arr,'0');
                
            }
        }

        function errorFunc(res) {

        }

    }

    function showList(arr,type){
     
      if (arr.length==0) {
        $("#page").css("padding",'0');
        $("#show_view").empty();
      }else{
        $("#page").css("padding",'5px 10px');
        console.log("*****")
        var  shtml=""
        if (type=='0') {
          for (var i = 0; i < arr.length; i++) {
            shtml+="<li><a href=./nhtml/nActivity0.html?id="+arr[i].acti_no+">"+arr[i].title+"</a></li>"
        }  
        }
        else if (type=='1') {
          for (var i = 0; i < arr.length; i++) {
            shtml+="<li><a href=./nhtml/teacher.html?expert_no="+arr[i].acti_no+">"+arr[i].expert_name+"</a></li>"
        }  
        }
         else if (type=='2') {
          for (var i = 0; i < arr.length; i++) {
            shtml+="<li><a href=./nhtml/loveDetail0.html?id="+arr[i].ARTICLE_ID+">"+arr[i].TITLE+"</a></li>"
          }  
        }
        console.log("123")
        $("#show_view").empty().append(shtml)
      }
      
    }
    function getFocus(){
      $.ajax({
            url: "/mine/getFocus?num=" + localStorage.getItem('number'),
            type: "get",
            dataType: "json",
            success: succesFunc,
            error: errorFunc
        });

        function succesFunc(res) {
            var arr=new Array();
            if (res.code == 200) {
                for (var i = 0; i < res.data.length; i++) {
                   if (res.data[i].expert_name) {
                    arr.push(res.data[i])
                   }
                }
                
                showList(arr,'1'); 
               
          console.log(res)
                
            }
        }

        function errorFunc(res) {

        }

    }
   
    function getLike(){
      $.ajax({
            url: "/mine/getLike?num=" + localStorage.getItem('number'),
            type: "get",
            dataType: "json",
            success: succesFunc,
            error: errorFunc
        });

        function succesFunc(res) {
            var arr=new Array();
            if (res.code == 200) {
            for (var i = 0; i < res.data.length; i++) {
                   if (res.data[i].TITLE) {
                    arr.push(res.data[i])
                   }
            }
            showList(arr,'2'); 
                   
                
            }
        }

        function errorFunc(res) {

        }

    }
</script>
</body>

</html>